<template>
  <div class="detail">
    <van-panel
      :title="list.zhaiyao"
      :status="'阅读'+list.click"
    >
      <div>{{list.content}}</div>
    </van-panel>
    <comment :id="id"></comment>
  </div>
</template >

<script>
import comment from '@/comment/comment.vue'
import { getdetail } from '../../../api/home'
export default {
  props: ['id'],
  data: () => ({
    list: []
  }),
  created() {
    this.getDetail()
  },
  methods: {
    async getDetail() {
      const res = await getdetail(this.id)
      this.list = res.data.message
    }
  },
  components: {
    comment
  }
}
</script>
<style lang="less" >
.detail {
  padding: 10px;
  .van-panel__header-value {
    flex: 0.5;
  }
  .van-panel__content {
    font-size: 12px;
    font-family: "楷体";
    text-indent: 2rem;
  }
  .van-cell__title {
    font-family: "楷体";
    font-weight: bold;
  }
}
</style>